<template>
  <div class="game-order">
    <table>
      <thead>
        <th>平台</th>
        <th>盘口</th>
        <!-- <th>最小赔率</th>
        <th>最大赔率</th>
        <th>金额类型</th>
        <th>预约金额</th>
        <th>预约时间</th> -->
        <th>订单状态</th>

        <th>下单赔率</th>
        <th>下单金额</th>
        <th>下单虚数金额</th>
        <th>下单时间</th>
        <th>下单账号</th>
        <th>订单号</th>
        <th>最小赔率</th>
        <th>最大赔率</th>
        <th>金额类型</th>
        <th>预约金额</th>
        <th>预约时间</th>
      </thead>
      <tbody>
        <tr v-if="game.order_list.length == 0 && game.order_add_list.length == 0">
          <td colspan="14">暂无数据</td>
        </tr>
        <tr v-for="item in game.order_list" :key="item.id">
          <td>
            <div class="platform">
              {{ platformObj[item.bc_type]?.name || item.bc_type }}
            </div>
          </td>
          <!-- <td>{{ item.place_pk_info_ch }}</td> -->
          <td style="display: flex; flex-direction: column">
            <div style="height: 18px">{{ item.place_pk_info_ch }}</div>
            <div style="height: 18px">
              {{ item.score == null || item.score.score == '' || item.score.score == null ? '-' : item.score.score }}
            </div>
          </td>
          
          <td>
            <app-text v-if="item.place_status == 0">准备下单</app-text>
            <app-text v-else-if="item.place_status == 1">正在下单</app-text>
            <app-text v-else-if="item.place_status == 2" type="green">下单成功</app-text>
            <app-text v-else-if="item.place_status == 3" type="red">下单失败</app-text>
          </td>
          <td>
            {{ item.place_odds_info }}
          </td>
          <td>
            {{ item.total_amount }}
          </td>
          <td>
            {{ item.real_amount }}
          </td>
          <td>
            {{ item.created_at }}
          </td>
          <td>
            {{ item.user_name }}
          </td>
          <td>
            {{ item.id }}
          </td>
          <td>{{ item.min_odd }}</td>
          <td>{{ item.max_odd }}</td>
          <td>{{ staketypeMap[item.reservation_stake_type] }}</td>
          <td>{{ item.reservation_stake }}</td>
          <td>
            {{ item.reservation_at }}
          </td>
        </tr>
        <tr v-for="item in game.order_add_list" :key="item.id">
          <td>
            <div class="platform">
              {{ platformObj[item.bc_type]?.name || item.bc_type }}
            </div>
          </td>
          <td style="display: flex; flex-direction: column">
            <div style="height: 18px">{{ item.place_pk_info_ch }}</div>
            <div
              style="height: 18px"
              v-if="
                store.task.taskType == '_place_order' ||
                store.task.taskType == '_copy_order_hand' ||
                store.task.taskType == '_copy_order_auto'
              "
            >
              {{ item.score.score == '' || item.score.score == null ? '-' : item.score.score }}
            </div>
          </td>
         
          <td>
            <app-text v-if="item.place_status == 0">[补]准备下单</app-text>
            <app-text v-else-if="item.place_status == 1">[补]正在下单</app-text>
            <app-text v-else-if="item.place_status == 2" type="green">[补]下单成功</app-text>
            <app-text v-else-if="item.place_status == 3" type="red">[补]下单失败</app-text>
          </td>
          <td>
            {{ item.place_odds_info }}
          </td>
          <td>
            {{ item.total_amount }}
          </td>
          <td>
            {{ item.real_amount }}
          </td>
          <td></td>
          <td>
            {{ item.user_name }}
          </td>
          <td>
            {{ item.id }}
          </td>
           <td>{{ item.min_odd }}</td>
          <td>{{ item.max_odd }}</td>
          <td>{{ staketypeMap[item.reservation_stake_type] }}</td>
          <td>{{ item.reservation_stake }}</td>
          <td>{{ item.reservation_at }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>
<script setup>
import { onMounted } from 'vue'

const { platformObj } = inject('/home')
const { store } = inject('/home')

const staketypeMap = ref({
  custom: '自定义',
  max: '最大限额',
  min: '最小限额',
})

const props = defineProps({
  game: Array,
})
</script>
<style lang="scss" scoped>
.game-order {
  border-radius: 8px;
  border: solid 1px var(--pcmain-color);
  padding: 16px 0 8px 0;
  margin-top: 8px;
  width: 1000px;
}

table {
  width: 100%;
  text-align: center;
  font-size: 12px;
}

th {
  font-weight: inherit;
  line-height: 28px;
  color: #778090;
}

td {
  line-height: 28px;
  color: #252a30;
}

.repair {
  line-height: 16px;
  text-align: center;
  font-size: 12px;
  color: #fff;
  padding: 0 4px;
  border-radius: 4px;
  background-color: var(--pcmain-color);
  margin-left: 4px;
}
</style>
